<template>
    <div class="demo_wrapper">
        <textarea rows="15" v-model="voiceText"></textarea>
        <button id="btn" @click="voice">click</button>
    </div>
</template>
<script>
export default {
    name: 'Demo',
    data() {
        return {
            voiceText: '查看此网页的中文翻译，请点击 翻译此页111'
        }
    },
    methods: {
        voice() {
            var synth = window.speechSynthesis;
            var utterThis = new SpeechSynthesisUtterance();
            utterThis.text = this.voiceText;
            utterThis.lang = 'zh-cn';
            utterThis.volume = '1';
            utterThis.rate = 1;
            utterThis.pitch = 1;
            synth.speak(utterThis);
        }
    }
}
</script>
<style lang="scss" scoped>
    textarea{
        border: 1px solid #eee;
    }
</style>
